package com.example.jetpackcomposelayouts

import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.verticalScroll
import androidx.compose.material3.Button
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import coil.compose.rememberImagePainter
import kotlinx.coroutines.launch
import kotlinx.coroutines.runBlocking

/**
 * @author huangzehui
 * @date 1/5/2024 下午3:09 周三
 * @description
 *
 * https://www.bilibili.com/video/BV1ob4y1a7ad/?p=17&spm_id_from=pageDriver&vd_source=e07cc8cc94eb22bd76722071b03cd199
 */


@Composable
fun SimpleColumn() {
    /*
        Column 默认无法滚动的
     */
    Column {
        repeat(100) {
            Text(text = "Item #${it}", style = MaterialTheme.typography.titleMedium)
        }
    }
}


@Composable
fun SimpleList() {
    /**
     * 这里就可以滚动了，相当于 ScrollView
     */
    val scrollState = rememberScrollState()
    Column(modifier = Modifier.verticalScroll(scrollState)) {
        repeat(10) {
            Text(text = "Item #${it}", style = MaterialTheme.typography.titleMedium)
        }
    }
}


@Composable
fun LazyList() {
    /**
     * LazyColumn 类似 RecyclerView
     */
    val scrollState = rememberLazyListState()
    LazyColumn(state = scrollState) {
        items(100) {
            Text(text = "Item #${it}", style = MaterialTheme.typography.titleMedium)
        }
    }
}

@Composable
fun ScrollingList() {
    /**
     * 控制滚动
     */
    val scrollState = rememberLazyListState()
    val listSize = 100

    // 协程作用域
    val coroutineScope = rememberCoroutineScope()

    Column {
        Row {
            Button(modifier = Modifier.weight(1f), onClick = {
                coroutineScope.launch {
                    scrollState.animateScrollToItem(0)
                }
            }) {
                Text(text = "Scroll to the top")
            }
            Button(modifier = Modifier.weight(1f), onClick = {
                coroutineScope.launch {
                    scrollState.animateScrollToItem(listSize - 1)
                }
            }) {
                Text(text = "Scroll to the end")

            }
        }
        LazyColumn(state = scrollState) {
            items(listSize) {
                ImageListItem(it)
            }
        }

    }
}

@Composable
fun ImageListItem(index: Int) {
    /**
     * 使用网络图片加载库，coil-compose
     */
    Row(verticalAlignment = Alignment.CenterVertically) {
        Image(
            painter = rememberImagePainter(
                data = "https://inews.gtimg.com/news_bt/OWvBqEB-jc6Q1r2UhKaeRr-uG6t39aEkVUds-OC0VNv4oAA/641"
            ),
            contentDescription = null,
            modifier = Modifier.size(50.dp)
        )

        Spacer(modifier = Modifier.size(10.dp))

        Text(text = "Item #${index}", style = MaterialTheme.typography.titleMedium)
    }
}
